iT邦幫忙

2023 iThome 鐵人賽

DAY 17
0
自我挑戰組

我的日常學習雜記與筆記整理系列 第 28

Day - 28 陣列與類陣列物件

  • 分享至 

  • xImage
  •  

JavaScript 陣列特色(並非定義陣列的必要條件):

// 建立一個名為fruitBasket的陣列
let fruitBasket = ["apple", "banana", "orange", "dragonfruit"];
console.log(fruitBasket.length); // 4

// 當新的元素被加入 Array 時,length 會自動更新
fruitBasket.push("strawberry");
console.log(fruitBasket.length); // 5

// 如果將 length 設為較小的值會將陣列截短(truncate)
fruitBasket.length = 2;
console.log(fruitBasket); // ["apple", "banana"]

// 陣列從 Array.prototype 繼承了一些實用的方法: push 和 join
fruitBasket.push("orange", "strawberry");
let joinedFruits = fruitBasket.join(', ');
console.log(joinedFruits); // "apple", "banana", "orange", "strawberry"

// 陣列的`class`屬性值為"Array"
console.log(fruitBasket instanceof Array); // true

類陣列物件

任何物件只要具有數值的length屬性和對應的非負整數屬性,就可以將其視為某種類型陣列來處理。

// 建立一個名為 fruitBasket 的物件,並給予其非負數的屬性及length屬性
let fruitBasket = {
    "0": "apple",
    "1": "banana",
    "2": "orange",
    length: 3
};

// 利用迴圈取出物件中的水果並印出
for (let i = 0; i < fruitBasket.length; i++) {
    console.log(fruitBasket[i]); // "apple"  "banana"  "orange"
}

這種物件在外觀上很像陣列,但實際上並非真正的陣列。所以不能直接在這種物件上使用陣列的方法,例如.push().pop(),也不能期待它的length屬性會像真正的陣列那樣自動更新。

但仍然可以像處理陣列一樣來處理。尤其是只讀取而不修改陣列(或至少不會改變陣列的長度)時:

// 書中範例
var a = {}; // 建立一個空的物件
// 加上一些屬性,使其成為類陣列物件
var i = 0;
while(i < 10) {
	a[i] = i * i; // 將每個索引值(index)指定為該索引的平方
	i++; 
}
a.length = i; // 將最大的索引值 + 1

// 當成真正陣列逐一走訪
var total = 0;
for(var j = 0; j < a.length; j++) {
	total+= a[j];
}


參考資料:


上一篇
Day - 27 函式引數與參數筆記
下一篇
Day - 29 函式引數- 物件屬性 & 引數型別(一) 筆記
系列文
我的日常學習雜記與筆記整理30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言